<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8">
    <title>轮播图</title>
</head>
<link rel="stylesheet" href="css/清除默认.css">
<style>
    .layout {
        height: 300px;
        width: 380px;
        position: relative;
        margin: 0 auto;
        overflow: hidden;

    }

    .list {
        height: 300px;
        width: 1140px;
    }

    .list > img {
        float: left;
    }
    .dot{
        width: 100px;
        height: 20px;
        background-color: red;
        position: absolute;
        margin: 0 auto;
        right: 10px;
        bottom: 20px;
    }
</style>
<body>
<div class="layout">
    <div class="list">
        <img src="img/京东1.png" alt="">
        <img src="img/京东2.png" alt="">
        <img src="img/京东3.png" alt="">
    </div>
    <div class="dot">
        <a href="">1</a>
        <a href="">1</a>
        <a href="">1</a>
        <a href="">1</a>
        <a href="">1</a>
    </div>
</div>

</body>
</html>